<template>
  <div>
    <MyBorrowEcharts :option="option"></MyBorrowEcharts>
  </div>
</template>

<script>
import MyBorrowEcharts from "@/views/echarts/MyBorrowEcharts";
export default {
  name: "BorrowCount",
  components:{MyBorrowEcharts},
  data(){
    return{

      option:{
        tooltip: {
          trigger:'item',
          formatter:(params)=>{
            if (params.value){
              return `借阅记录数量<br/>${params.name}:${params.value}条`
            }
          }
        },
        color: ["#3398DB"],
        title: {
          text: '借阅记录',
          left: "center",

          textStyle: {
            color: "rgb(14,105,136)",
            fontSize: 35,
            fontStyle: "oblique",
          },
        },

        xAxis: {
          type: 'category',
          data: []
        },
        yAxis: {
          type: 'value'
        },
        series: [
          {
            data: [],
            type: 'line',
            smooth: true
          }
        ]

      }
    }
  },
  mounted() {
    this.getData()
  },
  methods: {
    getData() {
      this.$axios.get("/lendList/BorrowCount")
          .then(res => {
            console.log(res)
            if (res.data.data) {
              for (let i = 0; i < res.data.data.length; i++) {
                this.option.xAxis.data.push(res.data.data[i].year)
                this.option.series[0].data.push(res.data.data[i].count)
              }
            }
          })
    }
  }
  }
</script>

<style scoped>

</style>